//
//  ConnectView.swift
//  ZkManager
//
//  Created by 笑看风云旦 on 2020/3/22.
//  Copyright © 2020 笑看风云旦. All rights reserved.
//

import SwiftUI

struct ConnectView: View {
    
    @State private var search : String = ""
    
    var body: some View {
        
        HStack(alignment: .top,spacing: 0){
            //左边栏 快速连接
            VStack(alignment: .leading,spacing: 0){
                
                //小提示
            Text("快速连接").foregroundColor(Color.gray).padding(EdgeInsets(top: 5, leading: 5, bottom: 5, trailing: 0))
                    .font(.system(size:11))

                Image("icons8-plus")
//                Image("test")
                
                //搜索框
                TextField("搜索", text: $search).padding(EdgeInsets(top: 0, leading: 5, bottom: 5, trailing: 5))
                
                //添加按钮
                Button(action: {
                    print("Tap")
                }) {
                    Image("plus")
                }.padding(EdgeInsets(top: 0, leading: 5, bottom: 5, trailing: 5))

                Button(action: {
                        print("lalala")
                    }, label: {
                        
                        HStack(alignment: .center, spacing: 10) {
                            Image("icons8-plus").resizable().frame(width: 18, height: 18, alignment: .center)
//                            Text("添加").padding(0)
                        }
                        
                }).frame(width: 50, height: 50)
                
            }.frame(width: 200)
            
            
            Divider()
            
            //右边栏 连接界面
            VStack(alignment: .center,spacing: 0){
                
                Text("请输入Zookeeper的连接信息").font(.system(size:22)).padding(EdgeInsets(top: 30, leading: 0, bottom: 0, trailing: 0))
                
                TabView{
                    Text("单机").font(.system(size:36))
                        .tabItem({
                            Text("单机")
                        })
                    Text("集群")
                        .tabItem({
                            Text("集群")
                        })
                }.padding(50)
                
                
            }
        }.frame(minWidth: 800, maxWidth: .infinity, minHeight: 450, maxHeight: .infinity)
    }
}


struct ConnectView_Previews: PreviewProvider {
    static var previews: some View {
        ConnectView()
    }
}
